<h1>Location</h1>

<div class="desc">Find longitude, latitude and altitude of a device's current location. After getting 
a location point, you may pinpoint that location using a map call.</div>

<script>
/*****************************************
 * GPS
 *****************************************/
//Get information from device
function setLocation() {
	$("#btnLocate").toggle(startGPS, stopGPS);
	$("#btnPinpoint").click(getMap);
	
	//Set info listener
	lg.bind('lg_location', getLocation);
}

function startGPS(e) {
	lg.location.accuracy = 3;
	lg.location.start();
}
function stopGPS(e) {
	lg.location.stop();
}
//Listener for library call
function getLocation(e){
	$('#lat').html(Math.round(lg.location.latitude*100)/100);
	$('#lng').html(Math.round(lg.location.longitude*100)/100);
	$('#alt').html(Math.round(lg.location.altitude*100)/100);
	$('#spd').html(Math.round(lg.location.speed*100)/100);
	$('#dir').html(Math.round(lg.location.direction*100)/100);
}

function getMap(e){
	lg.maps.pinpoint();
}
</script>

<p>&nbsp;</p>

<dl id="location_data">
  <dt>Latitude:</dt><dd id="lat">&nbsp;</dd>
  <dt>Longitude:</dt><dd id="lng">&nbsp;</dd>
  <dt>Altitude:</dt><dd id="alt">&nbsp;</dd>
  <dt>Speed:</dt><dd id="spd">&nbsp;</dd>
  <dt>Direction:</dt><dd id="dir">&nbsp;</dd>
</dl>

<p>&nbsp;</p>

<a id="btnLocate" class="button">Get Location</a>
<a id="btnPinpoint" class="button">Pinpoint</a>